<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath%>">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>权限管理系统－用户管理</title>
<script type="text/javascript" src="${resurl}/js/jquery.js"></script>
<script src="${resurl}/js/bootstrap.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="${resurl}/css/bootstrap.min.css">
<link rel="stylesheet" href="${resurl}/css/common.css">
<script type="text/javascript">
$(document).ready(function(){
	
	//删除用户
	$("button#deleteuser_btn").click(function(){
		var user_id=$("input[type='radio']:checked").val();
		$.post("${resurl}/userdelete.pms",{user_id:user_id},function(data,status){
		    	 location.reload();
		  });
	});
	
	//新增用户
	$("button#adduser_btn").click(function(){
		$("input#insert_inputUserName").val("");
		$("input#insert_inputPassword").val("");
		$("input#insert_inputNickName").val("");
		$("input#insert_inputEmail").val("");
		$("input#insert_inputPhoneNo").val("");
		$("h4#insert_modal_title").text("新增用户");		
	});
	
	//保存用户
	$("button#modal_insertuser_btn").click(function(){
		var username=$("input#insert_inputUserName").val();
		var password=$("input#insert_inputPassword").val();
		var nickname=$("input#insert_inputNickName").val();
		var email=$("input#insert_inputEmail").val();
		var phoneno=$("input#insert_inputPhoneNo").val();
		var valid=$("select#insert_selectValid").val();
		$.post("${resurl}/userinsert.pms",{user_name:username,user_password:password,user_nickname:nickname,user_email:email,user_phone_no:phoneno,user_valid:valid},function(data,status){
			    	 location.reload();
			  });
		 });
	
	
	//更新用户
	$("button#updateuser_btn").click(function(){
		//给修改框赋值
		var user_id=$("input[type='radio']:checked").val();
		var username=$("table tr#"+user_id).children().eq(1).text();
		var nickname=$("table tr#"+user_id).children().eq(2).text();
		var email=$("table tr#"+user_id).children().eq(3).text();
		var phoneno=$("table tr#"+user_id).children().eq(4).text();
		var valid=$("table tr#"+user_id).children().eq(6).text();
		$("h4#update_modal_title").text("修改用户信息:"+username);
		$("input[type='hidden']#modal_update_user_id").attr("value",user_id);
		$("input#update_inputNickName").val(nickname);
		$("input#update_inputEmail").val(email);
		$("input#update_inputPhoneNo").val(phoneno);
		if(valid=="yes"){
			$("#modal_update_valid_yes").prop("selected",true);
		}else{
			$("#modal_update_valid_no").prop("selected",true);
		}
	});

//更新用户
$("button#modal_updateuser_btn").click(function(){
	var user_id=$("input#modal_update_user_id").val();
	var nickname=$("input#update_inputNickName").val();
	var email=$("input#update_inputEmail").val();
	var phoneno=$("input#update_inputPhoneNo").val();
	var valid=$("select#update_selectValid").val();
	$.post("${resurl}/userupdate.pms",{user_id:user_id,user_nickname:nickname,user_email:email,user_phone_no:phoneno,user_valid:valid},function(data,status){
		    alert("Data: " + data + "\nStatus: " + status);
		    	 location.reload();
		  });
	 });
 
});

</script>
</head>
<body>
	<nav class="navbar navbar-inverse navbar-fixed-top">
		<div class="container-fluid">
			<div class="navbar-header">
				<button type="button" class="navbar-toggle collapsed"
					data-toggle="collapse" data-target="#navbar" aria-expanded="false"
					aria-controls="navbar">
					<span class="sr-only">Toggle navigation</span> <span
						class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<a class="navbar-brand" href="${resurl }/index.pms">权限管理系统</a>
			</div>
			<div id="navbar" class="navbar-collapse collapse">
				<ul class="nav navbar-nav navbar-right">
					<li><a href="#">设置</a></li>
					<li><a href="#">个人资料</a></li>
					<li><a href="#">帮助</a></li>
				</ul>
				<form class="navbar-form navbar-right">
					<input type="text" class="form-control" placeholder="查询...">
				</form>
			</div>
		</div>
	</nav>

	<div class="container-fluid">
		<div class="row">
			<div class="sidebar">
				<ul class="nav nav-sidebar">
					<li><a href="${resurl }/index.pms">首页</a></li>
					<li class="active"><a href="${resurl}/userindex.pms">用户管理
							<span class="sr-only">(current)</span>
					</a></li>
					<li><a href="${resurl}/deptindex.pms">部门管理</a></li>
					<li><a href="${resurl }/permindex.pms">权限管理</a></li>
					<li><a href="${resurl }/funindex.pms">功能管理</a></li>
				</ul>
			</div>
			<div class="main">
				<h2 class="sub-header">用户列表</h2>
				<div id="operator" class="navbar-collapse collapse operation">
					<ul class="nav navbar-nav navbar-right">
						<li class="li-button"><button id="adduser_btn" class="btn btn-sm btn-success btn-block" type="button" data-toggle="modal" data-target="#adduser_modal">新增</button></li>
						<li class="li-button"><button id="updateuser_btn"  class="btn btn-sm btn-warning btn-block" type="button" data-toggle="modal" data-target="#updateuser_modal">修改</button></li>
						<li class="li-button"><button id="deleteuser_btn" class="btn btn-sm btn-danger btn-block" type="button">删除</button></li>
					</ul>
				</div>
				<div class="table-responsive">
					<table class="table table-striped">
						<thead>
							<tr>
								<th>选择</th>
								<th>登陆名</th>
								<th>昵称</th>
								<th>邮箱</th>
								<th>电话</th>
								<th>是否有效</th>
							</tr>
						</thead>
						<tbody>
							
								<c:forEach items="${userlist}" var="user" varStatus="status">
									<tr id="${user.user_id }">
									<td><input name="user_id" type="radio" value="${user.user_id }"></td>
									<td id="user_name">${user.user_name }</td>
									<td id="user_nickname">${user.user_nickname }</td>
									<td id="user_email">${user.user_email }</td>
									<td id="user_phone">${user.user_phone_no }</td>
									<td id="user_valid"><c:if test="${user.user_valid=='yes'}">有效</c:if>
										<c:if test="${user.user_valid=='no'}">无效</c:if></td>
									<td id="user_valid_id" style="display:none">${user.user_valid }</td>
								</tr>
								</c:forEach>
							
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
	<!-- 模态框（Modal） -->
<div class="modal fade" id="adduser_modal" tabindex="-1" role="dialog"  aria-labelledby="adduserModelLabel" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                  &times;
            </button>
            <h4 id="insert_modal_title" class="modal-title">
               添加新用户
            </h4>
         </div>
         <div class="modal-body">
            <label for="insert_inputUserName" class="control-label">用户名</label>
        	<input name="username_input" type="text" id="insert_inputUserName" class="form-control" placeholder="输入用户名" required="" autofocus="">
        	<label for="insert_inputPassword">密码</label>
        	<input name="password_input" type="password" id="insert_inputPassword" class="form-control" placeholder="输入密码" required="">
        	<label for="insert_inputNickName">昵称</label>
        	<input name="nickname_input" type="text" id="insert_inputNickName" class="form-control" placeholder="输入昵称" required="" autofocus="">
        	<label for="insert_inputEmail">邮箱</label>
        	<input name="useremail_input" type="text" id="insert_inputEmail" class="form-control" placeholder="输入邮箱" required="" autofocus="">
        	<label for="insert_inputPhoneNo">电话</label>
        	<input name="phoneno_input" type="text" id="insert_inputPhoneNo" class="form-control" placeholder="输入电话号码" required="" autofocus="">
        	<label for="insert_selectValid">是否有效</label>
        	<select name="user_valid_select" id="insert_selectValid" class="form-control">
        	<option value="yes" selected>生效</option>
        	<option value="no">失效</option>
        	</select>                    	
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-default" 
               data-dismiss="modal">关闭
            </button>
            <button id="modal_insertuser_btn" type="button" class="btn btn-primary">
               保存
            </button>
         </div>
      </div><!-- /.modal-content -->
	</div>
	</div><!-- /.modal -->
	
	
	<div class="modal fade" id="updateuser_modal" tabindex="-1" role="dialog"  aria-labelledby="adduserModelLabel" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                  &times;
            </button>
            <h4 id="update_modal_title" class="modal-title">
               
            </h4>
         </div>
         <div class="modal-body">
        	<input id="modal_update_user_id" type="hidden" value=""/>
        	<label for="inputNickName">昵称</label>
        	<input name="nickname_input" type="text" id="update_inputNickName" class="form-control" placeholder="输入昵称" required="" autofocus="">
        	<label for="inputEmail">邮箱</label>
        	<input name="useremail_input" type="text" id="update_inputEmail" class="form-control" placeholder="输入邮箱" required="" autofocus="">
        	<label for="inputPhoneNo">电话</label>
        	<input name="phoneno_input" type="text" id="update_inputPhoneNo" class="form-control" placeholder="输入电话号码" required="" autofocus="">
        	<label for="selectValid">是否有效</label>
        	<select name="user_valid_select" id="update_selectValid" class="form-control">
        		<option id="modal_update_valid_yes" value="yes">生效</option>
        		<option id="modal_update_valid_no"  value="no">失效</option>
        	</select>                    	
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-default" 
               data-dismiss="modal">关闭
            </button>
            <button id="modal_updateuser_btn" type="button" class="btn btn-primary">
               更新
            </button>
         </div>
      </div><!-- /.modal-content -->
	</div>
	</div><!-- /.modal -->
</body>
</html>
